import React, { useState, useEffect } from 'react';
import {
  Card,
  Form,
  Input,
  Button,
  Switch,
  Divider,
  Space,
  Alert,
  Badge,
  Descriptions,
  Modal,
  message,
  Spin,
  Typography,
  Row,
  Col,
  Tag,
  Tooltip
} from 'antd';
import {
  ApiOutlined,
  SettingOutlined,
  CheckCircleOutlined,
  ExclamationCircleOutlined,
  ReloadOutlined,
  ExperimentOutlined,
  InfoCircleOutlined,
  EyeInvisibleOutlined,
  EyeTwoTone
} from '@ant-design/icons';
import { api } from '@/services/api';

const { TextArea } = Input;
const { Text, Title, Paragraph } = Typography;

interface CopilotConfig {
  mode: string;
  debug: boolean;
  timeout: number;
  maxRetries: number;
  logRequests: boolean;
  logResponses: boolean;
  copilot: {
    apiUrl: string;
    defaultModel: string;
    hasGithubToken: boolean;
    hasAuthToken: boolean;
    tokenValid?: boolean;
    tokenExpiry?: string;
    userAgent: string;
    proxy?: {
      enabled: boolean;
      url?: string;
      hasAuth: boolean;
    };
  };
}

interface TokenInfo {
  valid: boolean;
  expiresAt?: string;
  sku?: string;
  userId?: string;
}

interface TestResult {
  success: boolean;
  message: string;
  responseTime?: number;
  error?: string;
  tokenInfo?: TokenInfo;
}

const CopilotProxy: React.FC = () => {
  const [form] = Form.useForm();
  const [loading, setLoading] = useState(false);
  const [testing, setTesting] = useState(false);
  const [config, setConfig] = useState<CopilotConfig | null>(null);
  const [tokenInfo, setTokenInfo] = useState<TokenInfo | null>(null);
  const [tokenHealth, setTokenHealth] = useState<any>(null);
  const [testModalVisible, setTestModalVisible] = useState(false);
  const [testResult, setTestResult] = useState<TestResult | null>(null);
  const [showToken, setShowToken] = useState(false);
  const [refreshingToken, setRefreshingToken] = useState(false);

  useEffect(() => {
    loadConfig();
    loadTokenInfo();
    loadTokenHealth();
  }, []);

  const loadConfig = async () => {
    try {
      setLoading(true);
      const response = await api.get('/api/v1/proxy/config/full');
      setConfig(response.data);
      
      // 更新表单数据
      form.setFieldsValue({
        mode: response.data.mode,
        githubToken: '', // 不显示完整 GitHub token
        authToken: '', // 不显示完整 Copilot token
        apiUrl: response.data.copilot.apiUrl,
        defaultModel: response.data.copilot.defaultModel,
        timeout: response.data.timeout,
        retryAttempts: response.data.maxRetries,
        debug: response.data.debug,
        logRequests: response.data.logRequests,
        logResponses: response.data.logResponses,
        // 代理配置
        proxyEnabled: response.data.copilot.proxy?.enabled || false,
        proxyUrl: '', // 不显示完整代理 URL
        proxyUsername: '', // 不显示完整用户名
        proxyPassword: '' // 不显示完整密码
      });
    } catch (error) {
      message.error('加载配置失败');
      console.error('Load config error:', error);
    } finally {
      setLoading(false);
    }
  };

  const loadTokenInfo = async () => {
    try {
      const response = await api.get('/api/v1/proxy/config/token-info');
      setTokenInfo(response.data);
    } catch (error) {
      console.error('Load token info error:', error);
    }
  };

  const loadTokenHealth = async () => {
    try {
      const response = await api.get('/api/v1/proxy/config/token-health');
      setTokenHealth(response.data);
    } catch (error) {
      console.error('Load token health error:', error);
    }
  };

  const handleRefreshToken = async () => {
    try {
      setRefreshingToken(true);
      const response = await api.post('/api/v1/proxy/config/refresh-token');
      
      if (response.data.success) {
        message.success(response.data.message);
        loadTokenInfo();
        loadTokenHealth();
        loadConfig();
      } else {
        message.error(response.data.message || 'Token刷新失败');
      }
    } catch (error: any) {
      message.error(error.response?.data?.message || 'Token刷新失败');
      console.error('Refresh token error:', error);
    } finally {
      setRefreshingToken(false);
    }
  };

  const handleSaveConfig = async (values: any) => {
    try {
      setLoading(true);
      
      // 只发送需要更新的字段
      const updateData: any = {};
      
      if (values.githubToken && values.githubToken.trim()) {
        updateData.githubToken = values.githubToken.trim();
      }
      if (values.authToken && values.authToken.trim()) {
        updateData.authToken = values.authToken.trim();
      }
      if (values.apiUrl && values.apiUrl.trim()) {
        updateData.apiUrl = values.apiUrl.trim();
      }
      if (values.defaultModel) {
        updateData.defaultModel = values.defaultModel;
      }
      if (values.timeout) {
        updateData.timeout = values.timeout;
      }
      if (values.retryAttempts !== undefined) {
        updateData.retryAttempts = values.retryAttempts;
      }

      // 处理代理配置
      if (values.proxyEnabled !== undefined || values.proxyUrl || values.proxyUsername || values.proxyPassword) {
        updateData.proxy = {
          enabled: values.proxyEnabled || false,
          url: values.proxyUrl?.trim() || '',
          username: values.proxyUsername?.trim() || '',
          password: values.proxyPassword?.trim() || ''
        };
      }

      const response = await api.put('/api/v1/proxy/config/copilot', updateData);
      
      if (response.data.success) {
        message.success('配置保存成功');
        loadConfig();
        loadTokenInfo();
        loadTokenHealth();
      } else {
        message.error(response.data.message || '配置保存失败');
      }
    } catch (error: any) {
      message.error(error.response?.data?.message || '配置保存失败');
      console.error('Save config error:', error);
    } finally {
      setLoading(false);
    }
  };

  const handleSwitchMode = async (mode: string) => {
    try {
      setLoading(true);
      const response = await api.post('/api/v1/proxy/config/mode', { mode });
      
      if (response.data.success) {
        message.success(`已切换到${mode === 'mock' ? 'Mock' : 'Copilot'}模式`);
        loadConfig();
      } else {
        message.warning(response.data.message);
      }
    } catch (error: any) {
      message.error(error.response?.data?.message || '模式切换失败');
      console.error('Switch mode error:', error);
    } finally {
      setLoading(false);
    }
  };

  const handleTestConnection = async () => {
    // 使用保存的token而不是页面输入的token
    if (!config?.copilot?.hasAuthToken) {
      message.warning('请先保存 Copilot Token');
      return;
    }

    try {
      setTesting(true);
      const response = await api.post('/api/v1/proxy/config/test-connection', {
        testMessage: 'Hello, this is a connection test from Anthropic Proxy Server.'
      });
      
      setTestResult(response.data);
      setTestModalVisible(true);
    } catch (error: any) {
      setTestResult({
        success: false,
        message: '测试请求失败',
        error: error.response?.data?.message || error.message
      });
      setTestModalVisible(true);
    } finally {
      setTesting(false);
    }
  };

  const renderModeStatus = () => {
    if (!config) return null;

    const isCopilotMode = config.mode === 'copilot';
    const hasValidToken = config.copilot.hasAuthToken && config.copilot.tokenValid;
    const hasGithubToken = config.copilot.hasGithubToken;
    const proxyEnabled = config.copilot.proxy?.enabled || false;

    return (
      <Card size="small" className="mb-4">
        <Row gutter={16}>
          <Col span={5}>
            <Badge 
              status={isCopilotMode ? 'processing' : 'default'} 
              text={
                <span style={{ fontWeight: 500 }}>
                  当前模式: {isCopilotMode ? 'Copilot 转发' : 'Mock 模拟'}
                </span>
              } 
            />
          </Col>
          <Col span={5}>
            <Badge 
              status={hasGithubToken ? 'success' : 'error'} 
              text={
                <span>
                  GitHub Token: {hasGithubToken ? '已配置' : '未配置'}
                </span>
              } 
            />
          </Col>
          <Col span={5}>
            <Badge 
              status={hasValidToken ? 'success' : 'error'} 
              text={
                <span>
                  Copilot Token: {hasValidToken ? '有效' : '无效或未配置'}
                </span>
              } 
            />
          </Col>
          <Col span={4}>
            <Badge 
              status={proxyEnabled ? 'processing' : 'default'} 
              text={
                <span>
                  代理服务器: {proxyEnabled ? '已启用' : '未启用'}
                </span>
              } 
            />
          </Col>
          <Col span={5}>
            <Space>
              <Button 
                size="small" 
                type={isCopilotMode ? 'default' : 'primary'}
                onClick={() => handleSwitchMode('mock')}
                loading={loading}
              >
                切换到 Mock
              </Button>
              <Button 
                size="small" 
                type={isCopilotMode ? 'primary' : 'default'}
                onClick={() => handleSwitchMode('copilot')}
                loading={loading}
                disabled={!config.copilot.hasAuthToken}
              >
                切换到 Copilot
              </Button>
            </Space>
          </Col>
        </Row>
      </Card>
    );
  };

  const renderTokenInfo = () => {
    const getStatusColor = (status: string) => {
      switch (status) {
        case 'healthy': return 'green';
        case 'warning': return 'orange';
        case 'critical': return 'red';
        case 'invalid': return 'red';
        default: return 'gray';
      }
    };

    const getStatusText = (status: string) => {
      switch (status) {
        case 'healthy': return '健康';
        case 'warning': return '即将过期';
        case 'critical': return '即将失效';
        case 'invalid': return '无效';
        default: return '未知';
      }
    };

    if (!tokenHealth || !tokenHealth.token) {
      return (
        <Alert
          type="warning"
          message="Token 信息"
          description="未配置有效的 Copilot Token"
          showIcon
          className="mb-4"
          action={
            <Button 
              size="small" 
              type="primary" 
              onClick={handleRefreshToken}
              loading={refreshingToken}
              disabled={!config?.copilot?.hasGithubToken}
            >
              刷新Token
            </Button>
          }
        />
      );
    }

    const token = tokenHealth.token;
    const isValid = token.valid;

    return (
      <Card 
        size="small" 
        title="Token 信息" 
        className="mb-4"
        extra={
          <Space>
            <Button 
              size="small" 
              icon={<ReloadOutlined />} 
              onClick={() => { loadTokenInfo(); loadTokenHealth(); }}
              loading={loading}
            >
              刷新状态
            </Button>
            <Button 
              size="small" 
              type="primary" 
              icon={<ReloadOutlined />}
              onClick={handleRefreshToken}
              loading={refreshingToken}
              disabled={!config?.copilot?.hasGithubToken}
            >
              刷新Token
            </Button>
          </Space>
        }
      >
        <Descriptions size="small" column={2}>
          <Descriptions.Item label="状态">
            <Tag color={getStatusColor(token.status)}>
              {isValid ? getStatusText(token.status) : '无效'}
            </Tag>
          </Descriptions.Item>
          <Descriptions.Item label="过期时间">
            {token.expiresAt ? (
              <Tooltip title={new Date(token.expiresAt).toLocaleString()}>
                <Text>{new Date(token.expiresAt).toLocaleString()}</Text>
              </Tooltip>
            ) : '未知'}
          </Descriptions.Item>
          {isValid && token.expiresInMinutes !== undefined && (
            <Descriptions.Item label="剩余时间">
              <Text type={token.expiresInMinutes < 60 ? 'danger' : token.expiresInMinutes < 360 ? 'warning' : 'success'}>
                {token.expiresInMinutes > 60 
                  ? `${Math.floor(token.expiresInMinutes / 60)} 小时 ${token.expiresInMinutes % 60} 分钟`
                  : `${token.expiresInMinutes} 分钟`
                }
              </Text>
            </Descriptions.Item>
          )}
          <Descriptions.Item label="最后检查">
            <Text type="secondary">
              {tokenHealth.lastCheck ? new Date(tokenHealth.lastCheck).toLocaleString() : '未知'}
            </Text>
          </Descriptions.Item>
          {tokenInfo?.sku && (
            <Descriptions.Item label="订阅类型">
              <Tag>{tokenInfo.sku}</Tag>
            </Descriptions.Item>
          )}
          {tokenInfo?.userId && (
            <Descriptions.Item label="用户ID">
              <Text code>{tokenInfo.userId}</Text>
            </Descriptions.Item>
          )}
        </Descriptions>
        
        {tokenHealth.tokenManager && (
          <Divider style={{ margin: '12px 0' }} />
        )}
        
        {tokenHealth.tokenManager && (
          <div>
            <Text strong>Token 管理器状态:</Text>
            <Row gutter={16} style={{ marginTop: '8px' }}>
              <Col span={8}>
                <Badge 
                  status={tokenHealth.tokenManager.status === 'configured' ? 'success' : 'error'} 
                  text={tokenHealth.tokenManager.status === 'configured' ? '已配置' : '未配置'} 
                />
              </Col>
              <Col span={8}>
                <Badge 
                  status={tokenHealth.tokenManager.tokenValid ? 'success' : 'error'} 
                  text={tokenHealth.tokenManager.tokenValid ? 'Token有效' : 'Token无效'} 
                />
              </Col>
              {tokenHealth.tokenManager.expiresIn !== undefined && (
                <Col span={8}>
                  <Text type="secondary">
                    {tokenHealth.tokenManager.expiresIn > 0 
                      ? `${Math.floor(tokenHealth.tokenManager.expiresIn / 60)}min`
                      : '已过期'
                    }
                  </Text>
                </Col>
              )}
            </Row>
          </div>
        )}
      </Card>
    );
  };

  return (
    <div style={{ padding: '24px' }}>
      <Title level={2}>
        <ApiOutlined /> Copilot 转发配置
      </Title>
      <Paragraph type="secondary">
        配置 GitHub Copilot API 转发功能，支持在 Mock 模式和 Copilot 真实转发之间切换。
      </Paragraph>

      <Spin spinning={loading}>
        {renderModeStatus()}
        {renderTokenInfo()}

        <Row gutter={24}>
          <Col span={16}>
            <Card title="配置设置" extra={
              <Space>
                <Button icon={<ReloadOutlined />} onClick={() => { loadConfig(); loadTokenInfo(); loadTokenHealth(); }}>
                  刷新全部
                </Button>
                <Button 
                  icon={<ReloadOutlined />}
                  onClick={handleRefreshToken}
                  loading={refreshingToken}
                  disabled={!config?.copilot?.hasGithubToken}
                >
                  刷新Token
                </Button>
                <Button 
                  type="primary" 
                  icon={<ExperimentOutlined />} 
                  onClick={handleTestConnection}
                  loading={testing}
                >
                  测试连接
                </Button>
              </Space>
            }>
              <Form
                form={form}
                layout="vertical"
                onFinish={handleSaveConfig}
                autoComplete="off"
              >
                <Alert
                  type="info"
                  message="Token 配置说明"
                  description={
                    <div>
                      <p><strong>GitHub Token:</strong> 用于自动获取和刷新 Copilot Token，格式：ghu_...</p>
                      <p><strong>Copilot Token:</strong> 用于 API 调用，可通过 GitHub Token 自动获取，格式：</p>
                      <Text code style={{ wordBreak: 'break-all' }}>
                        tid=xxxxx;exp=xxxxx;sku=free_limited_copilot;proxy-ep=proxy.individual.githubcopilot.com;...
                      </Text>
                    </div>
                  }
                  showIcon
                  className="mb-4"
                />

                <Form.Item
                  label="GitHub Token"
                  name="githubToken"
                  rules={[
                    { 
                      pattern: /^ghu_/, 
                      message: '请输入有效的 GitHub Token 格式 (ghu_...)' 
                    }
                  ]}
                  extra="输入 GitHub Personal Access Token，用于获取和刷新 Copilot Token"
                >
                  <Input.Password
                    placeholder="ghu_xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
                    visibilityToggle={{
                      visible: showToken,
                      onVisibleChange: setShowToken,
                    }}
                  />
                </Form.Item>

                <Form.Item
                  label="Copilot Token (可选)"
                  name="authToken"
                  rules={[
                    { 
                      pattern: /tid=.*?;exp=.*?;/, 
                      message: '请输入有效的 Copilot Token 格式' 
                    }
                  ]}
                  extra="可手动输入 Copilot Token，或由系统通过 GitHub Token 自动获取"
                >
                  <Input.Password
                    placeholder="tid=xxxxx;exp=xxxxx;sku=free_limited_copilot;... (可留空，由系统自动获取)"
                    visibilityToggle={{
                      visible: showToken,
                      onVisibleChange: setShowToken,
                    }}
                  />
                </Form.Item>

                <Form.Item
                  label="API URL"
                  name="apiUrl"
                  rules={[
                    { required: true, message: '请输入API URL' },
                    { 
                      pattern: /^https?:\/\/.+/, 
                      message: '请输入有效的API URL格式 (http://... 或 https://...)' 
                    }
                  ]}
                  extra="Copilot API服务器地址，默认为：https://api.individual.githubcopilot.com"
                >
                  <Input 
                    placeholder="https://api.individual.githubcopilot.com"
                    allowClear
                  />
                </Form.Item>

                <Form.Item
                  label="默认模型"
                  name="defaultModel"
                  rules={[{ required: true, message: '请输入默认模型名称' }]}
                  extra="请输入您希望使用的模型名称，例如：claude-3.5-sonnet、gpt-4o、gpt-4o-mini 等"
                >
                  <Input 
                    placeholder="请输入模型名称，如：claude-3.5-sonnet"
                    allowClear
                  />
                </Form.Item>

                <Divider>代理服务器配置</Divider>

                <Form.Item
                  label="启用代理服务器"
                  name="proxyEnabled"
                  valuePropName="checked"
                  extra="启用后，所有Copilot API请求和GitHub Token刷新将通过代理服务器转发"
                >
                  <Switch />
                </Form.Item>

                <Form.Item
                  label="代理服务器 URL"
                  name="proxyUrl"
                  rules={[
                    {
                      pattern: /^https?:\/\/.+/,
                      message: '请输入有效的代理服务器 URL 格式 (http://... 或 https://...)'
                    }
                  ]}
                  extra="代理服务器地址，格式：http://proxy.example.com:8080"
                >
                  <Input placeholder="http://proxy.example.com:8080" />
                </Form.Item>

                <Row gutter={16}>
                  <Col span={12}>
                    <Form.Item
                      label="代理用户名"
                      name="proxyUsername"
                      extra="代理服务器认证用户名（可选）"
                    >
                      <Input placeholder="username" />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="代理密码"
                      name="proxyPassword"
                      extra="代理服务器认证密码（可选）"
                    >
                      <Input.Password placeholder="password" />
                    </Form.Item>
                  </Col>
                </Row>

                <Divider>请求配置</Divider>

                <Row gutter={16}>
                  <Col span={12}>
                    <Form.Item
                      label="请求超时时间 (ms)"
                      name="timeout"
                      rules={[{ required: true, message: '请输入超时时间' }]}
                    >
                      <Input type="number" min={1000} max={300000} />
                    </Form.Item>
                  </Col>
                  <Col span={12}>
                    <Form.Item
                      label="重试次数"
                      name="retryAttempts"
                      rules={[{ required: true, message: '请输入重试次数' }]}
                    >
                      <Input type="number" min={0} max={10} />
                    </Form.Item>
                  </Col>
                </Row>

                <Divider>调试选项</Divider>

                <Row gutter={16}>
                  <Col span={8}>
                    <Form.Item label="调试模式" name="debug" valuePropName="checked">
                      <Switch />
                    </Form.Item>
                  </Col>
                  <Col span={8}>
                    <Form.Item label="记录请求" name="logRequests" valuePropName="checked">
                      <Switch />
                    </Form.Item>
                  </Col>
                  <Col span={8}>
                    <Form.Item label="记录响应" name="logResponses" valuePropName="checked">
                      <Switch />
                    </Form.Item>
                  </Col>
                </Row>

                <Form.Item>
                  <Space>
                    <Button type="primary" htmlType="submit" loading={loading}>
                      保存配置
                    </Button>
                    <Button onClick={() => form.resetFields()}>
                      重置
                    </Button>
                  </Space>
                </Form.Item>
              </Form>
            </Card>
          </Col>

          <Col span={8}>
            <Card title="使用说明" size="small">
              <div style={{ fontSize: '13px', lineHeight: 1.6 }}>
                <h4>获取 GitHub Token 步骤：</h4>
                <ol>
                  <li>访问 GitHub Settings {'>'} Developer settings {'>'} Personal access tokens</li>
                  <li>生成新的 Classic Token</li>
                  <li>选择适当的权限（包括 copilot 相关权限）</li>
                  <li>复制生成的 ghu_ 开头的 token</li>
                </ol>

                <h4>获取 Copilot Token 步骤（可选）：</h4>
                <ol>
                  <li>打开浏览器开发者工具（F12）</li>
                  <li>使用 GitHub Copilot Chat 功能</li>
                  <li>在 Network 标签页找到 chat/completions 请求</li>
                  <li>复制 Authorization 头部中 Bearer 后的完整内容</li>
                </ol>

                <h4>API URL 配置说明：</h4>
                <ul>
                  <li><strong>默认URL：</strong> https://api.individual.githubcopilot.com</li>
                  <li><strong>企业版：</strong> https://api.business.githubcopilot.com</li>
                  <li><strong>自定义：</strong> 可配置为其他兼容的API服务器地址</li>
                  <li><strong>注意：</strong> 更改API URL后需要重新测试连接以确保兼容性</li>
                </ul>

                <h4>模式说明：</h4>
                <ul>
                  <li><strong>Mock 模式：</strong> 返回模拟响应，用于开发测试</li>
                  <li><strong>Copilot 模式：</strong> 转发到真实 GitHub Copilot API</li>
                </ul>

                <h4>代理服务器配置：</h4>
                <ul>
                  <li><strong>启用代理：</strong> 开启后所有API请求将通过代理服务器</li>
                  <li><strong>代理URL：</strong> 支持 HTTP/HTTPS 代理，格式如 http://proxy.example.com:8080</li>
                  <li><strong>认证信息：</strong> 如果代理需要认证，请输入用户名和密码</li>
                  <li><strong>安全性：</strong> 代理认证信息经过加密存储</li>
                </ul>

                <h4>Token 管理：</h4>
                <ul>
                  <li><strong>GitHub Token：</strong> 用于身份验证和获取 Copilot Token</li>
                  <li><strong>Copilot Token：</strong> 用于实际 API 调用，由系统自动管理</li>
                  <li><strong>自动刷新：</strong> 系统会在Token即将过期前自动刷新</li>
                  <li><strong>手动刷新：</strong> 可点击"刷新Token"按钮手动更新</li>
                  <li><strong>健康监控：</strong> 实时显示Token状态和剩余时间</li>
                </ul>

                <h4>注意事项：</h4>
                <ul>
                  <li>必须配置 GitHub Token 才能使用自动刷新功能</li>
                  <li>Copilot Token 可由系统自动获取，也可手动输入</li>
                  <li>Copilot 模式消耗真实配额</li>
                  <li>配置会实时生效，无需重启</li>
                  <li>Token状态颜色：绿色(健康)、橙色(即将过期)、红色(失效)</li>
                  <li>代理服务器配置同样适用于 GitHub Token 刷新请求</li>
                  <li>代理连接失败时系统会自动回退到直连模式</li>
                </ul>
              </div>
            </Card>
          </Col>
        </Row>
      </Spin>

      <Modal
        title="连接测试结果"
        open={testModalVisible}
        onCancel={() => setTestModalVisible(false)}
        footer={
          <Button type="primary" onClick={() => setTestModalVisible(false)}>
            确定
          </Button>
        }
      >
        {testResult && (
          <div>
            <Alert
              type={testResult.success ? 'success' : 'error'}
              message={testResult.success ? '连接测试成功' : '连接测试失败'}
              description={testResult.message}
              showIcon
              className="mb-3"
            />
            
            {testResult.responseTime && (
              <p>响应时间: <Tag color="blue">{testResult.responseTime} ms</Tag></p>
            )}
            
            {testResult.error && (
              <Alert type="error" message="错误详情" description={testResult.error} />
            )}
            
            {testResult.tokenInfo && (
              <Card size="small" title="Token 信息" className="mt-3">
                <Descriptions size="small" column={1}>
                  <Descriptions.Item label="有效性">
                    <Tag color={testResult.tokenInfo.valid ? 'green' : 'red'}>
                      {testResult.tokenInfo.valid ? '有效' : '无效'}
                    </Tag>
                  </Descriptions.Item>
                  {testResult.tokenInfo.expiresAt && (
                    <Descriptions.Item label="过期时间">
                      {new Date(testResult.tokenInfo.expiresAt).toLocaleString()}
                    </Descriptions.Item>
                  )}
                  {testResult.tokenInfo.sku && (
                    <Descriptions.Item label="订阅类型">
                      <Tag>{testResult.tokenInfo.sku}</Tag>
                    </Descriptions.Item>
                  )}
                </Descriptions>
              </Card>
            )}
          </div>
        )}
      </Modal>
    </div>
  );
};

export default CopilotProxy;